<template>
    <div>
        <el-row class="tac">
  <el-col >
    <el-menu
      default-active="2"
      class="el-menu-vertical-demo"
      @open="handleOpen"
      @close="handleClose"
      router>
      <el-menu-item :index="item.path" v-for="item,index in list" :key="index" @click="add(item)">
        <i class="el-icon-setting"></i>
        <span slot="title">{{item.title}}</span>
      </el-menu-item>
      <!-- <el-menu-item index="2">
        <i class="el-icon-setting"></i>
        <span slot="title">后台管理</span>
      </el-menu-item>
      <el-menu-item index="3">
        <i class="el-icon-setting"></i>
        <span slot="title">国际化</span>
      </el-menu-item>
      <el-menu-item index="4">
        <i class="el-icon-setting"></i>
        <span slot="title">基础表格</span>
      </el-menu-item>
      <el-menu-item index="5">
        <i class="el-icon-setting"></i>
        <span slot="title">tab选项卡</span>
      </el-menu-item> -->
    </el-menu>
  </el-col>
</el-row>
    </div>
</template>
<script>
import axios from 'axios'
  export default {
    data() {
        return {
            list:[]
        }
    },
    methods: {
      add(item){
        console.log(item);
        this.$store.commit('tabLists/add',item)
      },
      handleOpen(key, keyPath) {
        console.log(key, keyPath);
      },
      handleClose(key, keyPath) {
        console.log(key, keyPath);
      },
      xr(){
        axios.get('/params/lan').then(res=>{
            // console.log(res);
            this.list=res.data.data.data
        })
      },
    
    },
      mounted() {
        this.xr()
      },
  }
</script>